<template>
  <div>
    <!-- 路由导航菜单 -->
    <el-menu :default-active="currentPath" mode="horizontal" router>
      <el-menu-item index="/Deal/pending">待处理数量信息</el-menu-item>
      <el-menu-item index="/Deal/overtime">加班处理</el-menu-item>
      <el-menu-item index="/Deal/compoff">调休处理</el-menu-item>
    </el-menu>
    <!-- 路由视图 -->
    <router-view></router-view>
  </div>
</template>

<script>
export default {
  data() {
    return {
      currentPath: this.$route.path
    };
  },
  watch: {
    $route(to) {
      this.currentPath = to.path;
    }
  }
};
</script>

<style scoped>
/* 可以添加一些样式来美化菜单 */
.el-menu {
  margin-bottom: 20px;
}
</style>